<template>
  <div>{{ formattedString }}</div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
  props: {
    value: {
      type: String,
      required: true
    },
    target: { // 需要替换的目标字符或字符串数组
      type: Array, // 修改为数组类型
      required: true
    },
    separator: {
      type: String,
      required: true
    }
  },
  computed: {
    formattedString(): string {
      let result = this.value;
      for (const item of this.target) { // 遍历目标字符串数组
        result = result.replaceAll(item, this.separator); // 替换所有匹配项
      }
      return result; // 返回格式化后的字符串
    }
  }
});
</script>